
/**
 * echarat的配置
 */
!function(win){
    "use strict";
    var EchartOption = function(){

    }
    EchartOption.prototype={
        constructor:EchartOption,
        /**
         * 仪表盘
         */
        gauge:function() {
          var option =  {/* 仪表盘2 */

                color: '#fff',
                tooltip: { show: false },
                grid: {
                    left: '0%',
                    right: '0%',
                    bottom: '0%',
                    top: '0%',
                    containLabel: true,
                    borderWidth: '0'
                },
                title: {
                    text: "",
                    bottom: '20%',
                    left: '40%',
                    textStyle: {
                        fontSize: '1vw',
                        color: '#fff'
                    }
                },
                series: [
                    {
                        name: '业务指标',
                        type: 'gauge',
                        radius: '90%',
                        splitNumber: 10, // 分割段数，默认为5
                        z: 8,
                        min: 0,
                        max: 100,

                        axisLine: { // 坐标轴线
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: [[1, '#2cadc4']],
                                width: 0
                            }
                        },
                        axisTick: { // 坐标轴小标记
                            splitNumber: 5, // 每份split细分多少段
                            length:10, // 属性length控制线长
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#a38080',
                                width: 2,
                            }
                        },
                        axisLabel: { // 坐标轴文本标签，详见axis.axisLabel

                            textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
                                color: '#0ed096',
                                fontSize: "14",
                            }
                        },
                        splitLine: { // 分隔线
                            show: true, // 默认显示，属性show控制显示与否
                            length: 20, // 属性length控制线长
                            lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
                                color: 'auto',
                                width: 5,
                            }
                        },
                        pointer: {
                            show: true,
                            width: 5,
                            length: '70%',
                            color: '#fff'

                        },
                        detail: {
                            show: false,
                        },
                        title: {
                            show: false,
                        },
                        data: [{
                            value: 0
                        }]
                    },
                    {
                        type: "gauge",
                        radius: "99%",
                        startAngle: "225",
                        endAngle: "-45",
                        splitNumber: "120",
                        pointer: {
                            show: false,
                        },
                        detail: {
                            show: false,
                        },

                        axisLine: {
                            show: true,
                            lineStyle: {
                                color: [
                                    [1, "blue"]
                                ],
                                width: 2,
                                opacity: 1,
                            },
                        },
                        axisTick: {
                            show: false,
                        },
                        splitLine: {
                            show: false,

                        },
                        axisLabel: {
                            show: false,
                        },
                    },
                    {
                        type: "gauge",
                        radius: "82%",
                        startAngle: "225",
                        endAngle: "-45",
                        pointer: {
                            show: true,
                        },

                        data: [{
                            name: "数值",
                            value: (99 / 200) * 100,
                        },],
                        title: {
                            show: false,
                        },
                        axisLine: {
                            show: true,
                            lineStyle: {
                                color: '#fff',
                                width: 10,
                                shadowOffsetX: 0,
                                shadowOffsetY: 0,
                                opacity: 1,
                            },
                        },
                        axisTick: {
                            show: false,
                        },
                        splitLine: {
                            show: false,
                            length: 25,
                            lineStyle: {
                                color: "green",
                                width:10,
                                type: "solid",
                            },
                        },
                        axisLabel: {
                            show: false,
                            formatter: function (v) {
                                return v.toFixed(0);
                            },
                        },
                        animationDuration: 4000,
                    },
                    {

                        type: "gauge",
                        z: 2,
                        radius: "92%",
                        startAngle: "225",
                        endAngle: "-45",
                        //center: ["50%", "75%"], //整体的位置设置
                        axisLine: {
                            // 坐标轴线
                            lineStyle: {
                                // 属性lineStyle控制线条样式
                                color: [
                                    [1, "#c47d7d"]
                                ],
                                fontSize: 40,
                                width: 1,
                                opacity: 1, //刻度背景宽度
                            },
                        },
                        splitLine: {
                            show: false,
                        },
                        axisLabel: {
                            show: false,
                            formatter: function (v) {
                                return v.toFixed(0);
                            },
                        },
                        pointer: {
                            show: false,
                        },
                        axisTick: {
                            show: false,
                        },
                        detail: {
                            show: false,
                        },
                    },




                ]
            };
            return option;

        },
        /**
         * 仪表盘2
         */
        gauge2:function() {
            var option =  {/* 仪表盘2 */

                    color: '#fff',
                    tooltip: { show: false },
                    grid: {
                        left: '0%',
                        right: '0%',
                        bottom: '0%',
                        top: '0%',
                        containLabel: true,
                        borderWidth: '0'
                    },
                    title: {
                        text: "",
                        bottom: '20%',
                        left: '40%',
                        textStyle: {
                            fontSize: '1vw',
                            color: '#fff'
                        }
                    },
                    series: [
                        {
                            name: '业务指标',
                            type: 'gauge',
                            radius: '90%',
                            splitNumber: 10, // 分割段数，默认为5
                            z: 8,
                            min: 0,
                            max: 100,

                            axisLine: { // 坐标轴线
                                lineStyle: { // 属性lineStyle控制线条样式
                                    color: [[1, '#ff0000']],
                                    width: 0
                                }
                            },
                            axisTick: { // 坐标轴小标记
                                splitNumber: 5, // 每份split细分多少段
                                length:10, // 属性length控制线长
                                lineStyle: { // 属性lineStyle控制线条样式
                                    color: '#a38080',
                                    width: 2,
                                }
                            },
                            axisLabel: { // 坐标轴文本标签，详见axis.axisLabel

                                textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
                                    color: '#ff0000',
                                    fontSize: "14",
                                }
                            },
                            splitLine: { // 分隔线
                                show: true, // 默认显示，属性show控制显示与否
                                length: 20, // 属性length控制线长
                                lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
                                    color: 'auto',
                                    width: 5,
                                }
                            },
                            pointer: {
                                show: true,
                                width: 5,
                                length: '70%',
                                color: '#fff'

                            },
                            detail: {
                                show: false,
                            },
                            title: {
                                show: false,
                            },
                            data: [{
                                value: 0
                            }]
                        },
                        {
                            type: "gauge",
                            radius: "99%",
                            startAngle: "225",
                            endAngle: "-45",
                            splitNumber: "120",
                            pointer: {
                                show: false,
                            },
                            detail: {
                                show: false,
                            },

                            axisLine: {
                                show: true,
                                lineStyle: {
                                    color: [
                                        [1, "yellow"]
                                    ],
                                    width: 2,
                                    opacity: 1,
                                },
                            },
                            axisTick: {
                                show: false,
                            },
                            splitLine: {
                                show: false,

                            },
                            axisLabel: {
                                show: false,
                            },
                        },
                        {
                            type: "gauge",
                            radius: "82%",
                            startAngle: "225",
                            endAngle: "-45",
                            pointer: {
                                show: true,
                            },

                            data: [{
                                name: "数值",
                                value: (99 / 200) * 100,
                            },],
                            title: {
                                show: false,
                            },
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    color: '#fff',
                                    width: 10,
                                    shadowOffsetX: 0,
                                    shadowOffsetY: 0,
                                    opacity: 1,
                                },
                            },
                            axisTick: {
                                show: false,
                            },
                            splitLine: {
                                show: false,
                                length: 25,
                                lineStyle: {
                                    color: "green",
                                    width:10,
                                    type: "solid",
                                },
                            },
                            axisLabel: {
                                show: false,
                                formatter: function (v) {
                                    return v.toFixed(0);
                                },
                            },
                            animationDuration: 4000,
                        },
                        {

                            type: "gauge",
                            z: 2,
                            radius: "92%",
                            startAngle: "225",
                            endAngle: "-45",
                            //center: ["50%", "75%"], //整体的位置设置
                            axisLine: {
                                // 坐标轴线
                                lineStyle: {
                                    // 属性lineStyle控制线条样式
                                    color: [
                                        [1, "#c47d7d"]
                                    ],
                                    fontSize: 40,
                                    width: 1,
                                    opacity: 1, //刻度背景宽度
                                },
                            },
                            splitLine: {
                                show: false,
                            },
                            axisLabel: {
                                show: false,
                                formatter: function (v) {
                                    return v.toFixed(0);
                                },
                            },
                            pointer: {
                                show: false,
                            },
                            axisTick: {
                                show: false,
                            },
                            detail: {
                                show: false,
                            },
                        },




                    ]
                };
            return option;

        },
        /**
         * 温度计
         * value 当前温度
         * wd_max 0上最大温度
         * wd_min 0下最大温度
         */
        windu:function(value,wd_max,wd_min) {

            /*****设置温度计相关设置start*****/
            var TP_name="";
            var TP_value =value;//值
            var min = 0;//最小刻度
            var max = wd_max+wd_min;//最大刻度
            var offset = wd_min;//负数设置
            var step = 10;//步长
            var range = [0,30,50]//范围[高,中,低]
            var unit = '°C';//单位
            /**************/
            var scale = step/20;//比例
            var kd = [];
            var Gradient = [];
            var leftColor = '';
            var showValue = '';
            var len = max+(scale*15);//刻度+15
            var TP_txt = '';
// 刻度使用柱状图模拟，短设置1，长的设置3；构造一个数据
            for (var i = 0; i <= len; i++) {
                if (i < (min+(scale*10)) || i > (max+(scale*10))) {
                    kd.push('')
                } else {
                    if ((i - (scale*10)) % step === 0) {
                        kd.push('-10');
                    } else if ((i - (scale*10)) % (step/5) === 0) {
                        kd.push('-5');
                    } else {
                        kd.push('');
                    }
                }

            }
//中间线的渐变色和文本内容
            if (TP_value > range[2]) {
                Gradient.push({
                    offset: 0,
                    color: '#93FE94'
                }, {
                    offset: 0.5,
                    color: '#E4D225'
                }, {
                    offset: 1,
                    color: '#E01F28'
                })
            } else if (TP_value > range[1]) {
                Gradient.push({
                    offset: 0,
                    color: '#93FE94'
                }, {
                    offset: 1,
                    color: '#E4D225'
                })
            } else {
                Gradient.push({
                    offset: 1,
                    color: '#93FE94'
                })
            }
            if (TP_value > (max-offset+(scale*2))) {
                showValue = max-offset+(scale*2);
            } else if (TP_value < min-offset) {
                showValue = min-offset;
            } else {
                showValue = TP_value
            }

            offset = offset+(scale*10);//负数设置+10
            leftColor = Gradient[Gradient.length - 1].color;
// 因为柱状初始化为0，温度存在负值，所以加上负值60和空出距离10


            /*****设置温度计相关设置end*****/

            var option =  {//温度计

                grid:{
                    top:'5%',
                    bottom:'6%',
                    left:'0',


                },
                yAxis: [{
                    show: false,
                    data: [],
                    min: 0,
                    max: len,
                    axisLine: {
                        show: false
                    }
                }, {
                    show: false,
                    min: 0,
                    max: 50,
                }],
                xAxis: [{
                    show: true,
                    min: -100,
                    max: 70,
                    axisTick: 'none',
                    axisLine: 'none',
                    offset: 40,
                    axisLabel: {
                        textStyle: {
                            color: '#ffffff',
                            fontSize: '24',
                        },
                    },
                    data: [TP_name],
                }, {
                    show: true,
                    min: -100,
                    max: 70,
                    axisTick: 'none',
                    axisLine: 'none',
                    offset: 0,
                    axisLabel: {
                        padding: [0, 4, -8, 6],
                        textStyle: {
                            color: '#66b1fd',
                            fontSize: '10',
                        },
                    },
                    data: [TP_value+unit],
                    z: 9,
                }, {
                    show: false,
                    min: -100,
                    max: 70,
                    data: []
                }, {
                    show: false,
                    min: -70,
                    max: 80,

                }],
                series: [{
                    name: '条',
                    type: 'bar',
                    // 对应上面XAxis的第一个对)象配置
                    xAxisIndex: 0,
                    data: [{
                        value: (showValue + offset),
                    }],
                    barWidth: 5,
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, Gradient)
                        }
                    },
                    z: 2
                }, {
                    name: '白框',
                    type: 'bar',
                    xAxisIndex: 1,
                    barGap: '-100%',
                    data: [len-scale],
                    barWidth: 10,
                    itemStyle: {
                        normal: {
                            color: '#8998ff',
                            barBorderRadius: 50,
                        }
                    },
                    z: 1
                }, {
                    name: '外框',
                    type: 'bar',
                    xAxisIndex: 2,
                    barGap: '-100%',
                    data: [len],
                    barWidth: 15,
                    itemStyle: {
                        normal: {
                            color: '#4577BA',
                            barBorderRadius: 50,
                        }
                    },
                    z: 0
                }, {
                    name: '圆',
                    type: 'scatter',
                    hoverAnimation: false,
                    data: [0],
                    xAxisIndex: 0,
                    symbolSize: 15,
                    itemStyle: {
                        normal: {
                            color: '#93FE94',
                            opacity: 1,
                        }
                    },
                    z: 2
                }, {
                    name: '白圆',
                    type: 'scatter',
                    hoverAnimation: false,
                    data: [0],
                    xAxisIndex: 1,
                    symbolSize: 20,
                    itemStyle: {
                        normal: {
                            color: '#0C2E6D',
                            opacity: 1,
                        }
                    },
                    z: 1
                }, {
                    name: '外圆',
                    type: 'scatter',
                    hoverAnimation: false,
                    data: [0],
                    xAxisIndex: 2,
                    symbolSize: 25,
                    itemStyle: {
                        normal: {
                            color: '#4577BA',
                            opacity: 1,
                        }
                    },
                    z: 0
                }, {
                    name: '刻度',
                    type: 'bar',
                    yAxisIndex: 0,
                    xAxisIndex: 3,
                    label: {
                        normal: {
                            show: true,
                            position: 'left',
                            distance: 5,
                            color: '#986558',
                            fontSize: 12,
                            formatter: function(params) {
                                if (params.dataIndex > (max+(scale*10)) || params.dataIndex < (min+(scale*10))) {
                                    return '';
                                } else {
                                    if ((params.dataIndex - (scale*10)) % step === 0) {
                                        return params.dataIndex - offset;
                                    } else {
                                        return '';
                                    }
                                }
                            }
                        }
                    },
                    barGap: '-100%',
                    data: kd,
                    barWidth: 1,
                    itemStyle: {
                        normal: {
                            color: '#ff0000',
                            barBorderRadius: 120,
                        }
                    },
                    z: 0
                }]
            };
            return option;

        },
        /**
         * 实时折线图
         */
        realTimeLine:function(moduleValue) {

            var now = new Date();
           var dataArray={
                value: [
                    now.getFullYear()+"-"+$_check(now.getMonth()+1)+"-"+$_check(now.getDate())+" "+$_check(now.getHours())+":"+$_check(now.getMinutes())+":"+$_check(now.getSeconds()),
                    moduleValue
                ]

            };
            var datAArra1={
                value: [
                   '2020-12-04 01:01:02',
                    10
                ]

            };
            var datAArray2={
                value: [
                    '2020-12-04 01:01:03',
                    25
                ]

            };
            var datAArray3={
                value: [
                    '2020-12-04 01:01:04',
                    50
                ]

            };
            var datAArray4={
                value: [
                    '2020-12-04 01:01:05',
                    45
                ]

            };
            var datAArray5={
                value: [
                    '2020-12-04 01:01:06',
                    80
                ]

            };

            var data = [];
            if(moduleValue===''){
                data.push(datAArra1);
                data.push(datAArray2);
                data.push(datAArray3);
                data.push(datAArray4);
                data.push(datAArray5);
            }else{
                data.push(dataArray);
            }

            var option =  {

                grid: {
                    top:10,
                    bottom:22
                },
                title: {
                    text: ''
                },
                tooltip: {
                    trigger: 'axis',

                    axisPointer: {
                        animation: false
                    }
                },
                xAxis: {
                    type: 'time',
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#46fcba',  //更改坐标轴文字颜色
                            fontSize : 12      //更改坐标轴文字大小
                        }
                    }
                },
                yAxis: {
                    type: 'value',
                    boundaryGap: [0, '100%'],
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#46fcba',  //更改坐标轴文字颜色
                            fontSize : 12      //更改坐标轴文字大小
                        }
                    }
                },
                series: [{
                    name: '值',
                    type: 'line',
                    showSymbol: true,
                    hoverAnimation: false,
                    data: data
                }]
            };
            return option;


        },
    /**
     * 水池
     */
         pool:function(moduleValue) {

        var value = moduleValue;
        var data = [value, value, value ];
        var option = {
            backgroundColor: new echarts.graphic.RadialGradient(0.3, 0.3, 0.8, [{
                offset: 0,
                color: '#431ab8'
            }, {
                offset: 1,
                color: '#471bba'
            }]),
           /* title: {
                text: (value * 100).toFixed(0) + '{a|%}',
                textStyle: {
                    fontSize: 20,
                    fontFamily: 'Microsoft Yahei',
                    fontWeight: 'normal',
                    color: '#bcb8fb',
                    rich: {
                        a: {
                            fontSize: 20,
                        }
                    }
                },
                x: 'center',
                y: '35%'
            },*/
            graphic: [{
                type: 'group',
                left: 'center',
                top: '60%',
                children: [{
                    type: 'text',
                    z: 100,
                    left: '10',
                    top: 'middle',
                    style: {
                        fill: '#aab2fa',
                        font: '20px Microsoft YaHei'
                    }
                }]
            }],
            series: [{
                type: 'liquidFill',
                radius: '100%',
                center: ['50%', '50%'],
                //  shape: 'roundRect',
                shape: 'container',
                data: data,
                backgroundStyle: {
                    color: {
                        type: 'linear',
                        x: 1,
                        y: 0,
                        x2: 0.5,
                        y2: 1,
                        colorStops: [{
                            offset: 1,
                            color: 'rgba(68, 145, 253, 0)'
                        }, {
                            offset: 0.5,
                            color: 'rgba(68, 145, 253, .25)'
                        }, {
                            offset: 0,
                            color: 'rgba(68, 145, 253, 1)'
                        }],
                        globalCoord: false
                    },
                },
                outline: {
                    borderDistance: 0,
                    itemStyle: {
                        borderWidth: 10,
                        borderColor: {
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 0,
                            y2: 1,
                            colorStops: [{
                                offset: 0,
                                color: 'rgba(69, 73, 240, 0)'
                            }, {
                                offset: 0.5,
                                color: 'rgba(69, 73, 240, .25)'
                            }, {
                                offset: 1,
                                color: 'rgba(69, 73, 240, 1)'
                            }],
                            globalCoord: false
                        },
                        shadowBlur: 10,
                        shadowColor: '#000',
                    }
                },
                color: {
                    type: 'linear',
                    x: 0,
                    y: 0,
                    x2: 0,
                    y2: 1,
                    colorStops: [{
                        offset: 1,
                        color: 'rgba(58, 71, 212, 0)'
                    }, {
                        offset: 0.5,
                        color: 'rgba(31, 222, 225, .2)'
                    }, {
                        offset: 0,
                        color: 'rgba(31, 222, 225, 1)'
                    }],
                    globalCoord: false
                },
                label: {
                    normal: {
                        formatter: '',
                    }
                }
            }, ]
        };
        return option;


    }


    }





    win.EchartOption = EchartOption;
}(window);

